<template>
    <view class="w100 p-30">
        <view class="line-height1 ft-32 t-9 mb-24 text-center"
            >— <text class="t-3 ml-6 mr-6">商品详情</text> —</view
        >
        <u-parse :content="content" :tagStyle="style" :previewImg="false"></u-parse>
    </view>
</template>

<script setup>
/**
 * @description 商品详情
 * @author yinzhi
 * @date 2025-03-19
 */
import { ref, defineComponent } from 'vue'
defineComponent({
    name: 'GoodsDetails'
})

const props = defineProps({
    // 商品信息
    info: {
        type: Object,
        default: () => {}
    }
})

// 内容详情
const content = ref(`<div>
        <img src="https://img30.360buyimg.com/sku/jfs/t1/33725/21/22236/54059/669f9119F953057fe/0a27b9c1f76b1b0f.jpg" />
        <img src="https://img30.360buyimg.com/sku/jfs/t1/93091/17/50387/200346/671b8969Fa987b836/7e014f649432715b.jpg"/><img src="https://img30.360buyimg.com/sku/jfs/t1/11038/16/21090/144262/669f9121F0dfb1376/0599ba1bf21cf875.jpg"/><img src="https://img30.360buyimg.com/sku/jfs/t1/1707/37/21717/136003/669f911dF807e98d0/1f1bc6ed1e01fa6d.jpg"/></div>`)

// 自定义一些标签样式
const style = {
    img: 'max-width: 100%;max-height: none;margin: 0;display: block;',
    p: 'margin-bottom: 6px'
}
</script>

<style scoped lang="scss"></style>
